import React, { memo } from "react";
import { Table } from "antd";
import styles from "./style.module.less";

// 模拟数据
const mockData = [
  { title: "生产对程中蒸汽质星流显额定值", value: "35.002", unit: "kg/h" },
  { title: "工作点 脱水", value: "502", unit: "I/h" },
  { title: "工作点 桶温", value: "137.5", unit: "℃" },
  { title: "工艺气速度", value: "10.8", unit: "kg/h" },
  { title: "额定值 卸料罩压力", value: "0.57", unit: "m/s" },
  { title: "烟丝流量", value: "0.0", unit: "kg/h" },
  { title: "烟丝流量", value: "0.1", unit: "kg/h" },
  { title: "工艺温度", value: "88.8", unit: "℃" },
  { title: "工艺温度", value: "72.6", unit: "℃" },
  { title: "冷凝水温度", value: "17.9", unit: "℃" },
  { title: "罩压力", value: "-12.7", unit: "μbar" },
  { title: "罩压力", value: "-9", unit: "μbar" },
  { title: "工艺气温度", value: "0.5700", unit: "m/s" },
  { title: "工艺气温度", value: "0.4356", unit: "m/s" },
  { title: "最终烟丝", value: "12.60", unit: "%H2O" },
  { title: "最终烟丝", value: "0.86", unit: "%H2O" },
  { title: "蒸汽质量流量", value: "3108.6", unit: "kg/h" },
  { title: "蒸汽质量流量", value: "559.8", unit: "m3/h" },
  { title: "蒸汽质量流量", value: "10", unit: "bar" },
  { title: "脱水", value: "0.0", unit: "I/h" },
];

const columns = [
  {
    title: "参数名称",
    dataIndex: "title",
    key: "title",
    className: styles.columnTitle,
  },
  {
    title: "数值",
    dataIndex: "value",
    key: "value",
    className: styles.columnValue,
    render: (value) => (value ? value : "暂无数据"),
  },
  {
    title: "单位",
    dataIndex: "unit",
    key: "unit",
    className: styles.columnUnit,
  },
];

const DataList = () => {
  return (
    <div className={styles.dataListContainer}>
      <Table
        dataSource={mockData}
        columns={columns}
        pagination={false}
        rowKey={(record) => record.title}
        bordered
      />
    </div>
  );
};

export const MemoDataList = memo(DataList);
